<!-- 自立项目 table -->
<template>
  <div>
    <el-table
      :header-cell-style="{ background: '#ECF1F9', color: '#1D2E54' }"
      v-loading="listLoading"
      :data="projectlistArr"
      style="width: 100%"
      element-loading-text="Loading"
      border
      stripe
      fit
      highlight-current-row
    >
      <el-table-column label="#" type="index" width="100px" align="center" />

      <el-table-column label="项目名称" align="center" width="140">
        <template slot-scope="scope">
          {{ scope.row.projectName ? scope.row.projectName : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="项目申报类别" align="center" width="110">
        <template slot-scope="scope">
          {{ scope.row.projectType ? scope.row.projectType : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="申报单位" align="center">
        <template slot-scope="scope">
          {{ scope.row.projectUnit ? scope.row.projectUnit : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="项目负责人姓名/职称" align="center" width="220">
        <template slot-scope="scope">
          {{ scope.row.specialistInfo ? scope.row.specialistInfo : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="通讯地址及邮编" align="center" width="180">
        <template slot-scope="scope">
          {{ scope.row.contractAddress ? scope.row.contractAddress : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="手机号码及电子邮箱" align="center" width="180">
        <template slot-scope="scope">
          {{ scope.row.contractPhone ? scope.row.contractPhone : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="合作单位" align="center">
        <template slot-scope="scope">
          {{ scope.row.cooperateUnit ? scope.row.cooperateUnit : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="申请人" align="center">
        <template slot-scope="scope">
          {{ scope.row.createBy ? scope.row.createBy : "--" }}
        </template>
      </el-table-column>

      <el-table-column label="申请时间" align="center">
        <template slot-scope="scope">
          {{ scope.row.createTime ? scope.row.createTime : "--" }}
        </template>
      </el-table-column>

      <el-table-column
        label="状态"
        width="100"
        align="center"
        v-if="current == 0"
      >
        <template slot-scope="scope">
          <!-- 0-未提交，1-待审核，2-审核中，3-已审核 -->
          <el-link type="info" v-if="scope.row.status == 0">未提交</el-link>
          <el-link type="success" v-if="scope.row.status == 1">待审核</el-link>
          <el-link v-if="scope.row.status == 2">审核中</el-link>
          <el-link v-if="scope.row.status == 3" type="warning">已审核</el-link>
        </template>
      </el-table-column>

      <el-table-column
        label="审批结果"
        width="100"
        align="center"
        v-if="current == 0"
      >
        <!-- 0 已通过 1 已驳回 2 未审批 9 已拒绝 -->
        <template slot-scope="{ row }">
          <el-link type="primary" v-if="row.approveResult == 0">已通过</el-link>
          <el-link type="danger" v-else-if="row.approveResult == 1">
            已驳回
          </el-link>
          <el-link type="warning" v-else-if="row.approveResult == 9">
            已拒绝
          </el-link>
          <el-link type="info" v-else>审核中</el-link>
        </template>
      </el-table-column>

      <!-- 申报人操作 -->
      <el-table-column
        width="200"
        label="操作"
        align="center"
        v-if="current == 0 && !isReview"
        fixed="right"
      >
        <template slot-scope="scope">
          <!-- {{ scope.row.projectPeriod }}
          {{ scope.row.status }}
          scope.row.approveResult -->

          <!-- 初审时被驳回 -->
          <!-- 驳回详情 -->
          <el-button
            v-if="scope.row.approveResult == 1"
            type="primary"
            plain
            size="mini"
            @click="boHuiInfo(scope.row)"
          >
            详情
          </el-button>
          <!-- 驳回修改 -->
          <el-button
            v-if="
              scope.row.approveResult == 1 &&
              scope.row.projectPeriod == 'FIRST_TRIAL'
            "
            type="primary"
            plain
            size="mini"
            @click="boHuiSubmit(scope.row)"
          >
            修改
          </el-button>
          <!--
          {{ scope.row.status }}
          <div v-if="isKeGuan">
            <el-link type="primary">修改</el-link>
          </div> -->
          <!-- <div v-else> -->
          <el-button
            v-if="
              scope.row.projectPeriod == 'FIRST_TRIAL' &&
              scope.row.approveResult != 1
            "
            type="primary"
            plain
            size="mini"
            @click="viewDetailsAA(scope.row)"
          >
            详情
          </el-button>
          <el-button
            v-if="
              scope.row.projectPeriod == 'SPECIALIST_TRIAL' &&
              scope.row.approveResult != 1
            "
            type="primary"
            plain
            size="mini"
            @click="viewXianXia(scope.row)"
          >
            详情
          </el-button>
          <span
            v-if="
              scope.row.projectPeriod == 'SUPPLY_FILE' &&
              scope.row.approveResult != 1
            "
          >
            <el-button
              plain
              size="mini"
              type="primary"
              @click="viewBuChong(scope.row)"
            >
              详情
            </el-button>
            <el-button
              plain
              size="mini"
              type="success"
              @click="toBuChong(scope.row)"
            >
              去补充
            </el-button>
          </span>
          <el-button
            plain
            size="mini"
            v-if="scope.row.projectPeriod == 'FINAL_TRIAL'"
            type="primary"
            @click="viewZhongShen(scope.row)"
          >
            详情
          </el-button>
          <el-button
            plain
            size="mini"
            v-if="scope.row.projectPeriod == 'FINISHED'"
            type="primary"
            @click="viewZhongShen(scope.row)"
          >
            详情
          </el-button>
          <el-button
            plain
            size="mini"
            v-if="scope.row.isChange == 1 && scope.row.changeType != 11"
            type="primary"
            @click="changeProjectInfo(scope.row)"
          >
            变更
          </el-button>
        </template>
      </el-table-column>

      <!-- 审核员操作 -->
      <el-table-column
        label="操作"
        align="center"
        v-if="current == 0 && isReview"
        fixed="right"
        width="200"
      >
        <template slot-scope="{ row }">
          <el-button plain size="mini" type="primary" @click="shenHeInfo(row)">
            详情
          </el-button>
          <span
            v-if="
              loginUser == '科研管理员' &&
              row.status != 3 &&
              row.approveResult != 1
            "
          >
            <el-button
              plain
              size="mini"
              type="success"
              v-if="
                row.projectPeriod == 'FIRST_TRIAL' ||
                row.projectPeriod == 'SPECIALIST_TRIAL'
              "
              @click="toShenPro(row)"
            >
              待审批
            </el-button>
            <el-button
              plain
              size="mini"
              type="success"
              v-if="row.projectPeriod == 'FINAL_TRIAL'"
              @click="toLastShen(row)"
            >
              终审
            </el-button>
          </span>
          <!-- <el-link type="primary" @click="viewDetails(scope.row)">详情</el-link> -->
        </template>
      </el-table-column>

      <!-- 草稿列表 -->
      <el-table-column
        label="操作"
        width="200"
        align="center"
        v-if="current == 1 && !isKeGuan"
        fixed="right"
      >
        <template slot-scope="{ row }">
          <el-button size="mini" plain type="primary" @click="uploadInfo(row)">
            编辑
          </el-button>
          <el-button size="mini" plain type="danger" @click="delProject(row)">
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!-- <Info
      ref="infodialog"
      :isSeeInfo="isSeeInfo"
      :dialogItemObj="dialogItemObj"
      @handleCloseFn="handleCloseFn"
    /> -->
    <changeInfo
      ref="infodialog"
      :isSeeInfo="isSeeInfo"
      :dialogItemObj="dialogItemObj"
      :projectId="projectId"
      :changeType="changeType"
      @handleCloseFn="handleCloseFn"
    />
  </div>
</template>

<script>
import changeInfo from "./coms/changeInfo.vue";
import { apiProjectInfo } from "@/api2/projectManagement/reporting";

// import Info from "./coms/info.vue";

export default {
  props: {
    // 是否是审核列表
    isReview: {
      type: Boolean,
      default: false,
    },
    listLoading: {
      type: Boolean,
      default: false,
    },
    isKeGuan: {
      type: Boolean,
      default: false,
    },
    projectlistArr: {
      type: Array,
      default: () => [],
    },
    current: {
      type: Number,
      default: 0,
    },
  },
  data() {
    const loginUser = JSON.parse(sessionStorage.getItem("loginUserinfo")).name;
    return {
      loginUser,
      projectId: 0,
      yusuanlist: [
        "咨询费",
        "差旅费",
        "培训/会议费",
        "劳务费",
        "专用设备购置费",
        "专用材料购置费",
        "图书文献数据费",
        "出版/文献/信息传播/知识产权事务费",
        "其他支出",
      ],
      changeType: "", //变更的内容
      step_1: require("@/assets/static/imgs/step_1.png"),
      step_2: require("@/assets/static/imgs/step_2.png"),
      step_3: require("@/assets/static/imgs/step_3.png"),
      step_4: require("@/assets/static/imgs/step_4.png"),
      step_5: require("@/assets/static/imgs/step_5.png"),
      isSeeInfo: false,
      dialogItemObj: {
        content: [],
      }, // dialog 显示的数据
    };
  },
  computed: {
    // 项目类型
    pType() {
      return this.$store.state.project.projectInfo.type;
    },
  },
  components: { changeInfo },
  methods: {
    // 项目被驳回了，查看详情
    boHuiInfo(row) {
      this.$store.dispatch("project/setNewPeo", false);
      // this.$store.dispatch("project/showDengJiFn", true); // 登记结果
      // this.$store.dispatch("project/setShowDengJiInput", true); // 能输入登记信息
      this.$store.dispatch("project/SetIsSeeProcess", false);
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },
    // 项目被驳回了，修改提交
    boHuiSubmit(row) {
      this.$store.dispatch("project/setNewPeo", true);
      // this.$store.dispatch("project/showDengJiFn", true); // 登记结果
      this.$store.dispatch("project/setShowDengJiInput", true); // 能输入登记信息
      this.$store.dispatch("project/SetIsSeeProcess", false);
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },

    // 初审详情
    viewDetailsAA(row) {
      this.$store.dispatch("project/setNewPeo", false);
      this.$store.dispatch("project/showDengJiFn", false); // 登记结果
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },

    // 下线详情
    viewXianXia(row) {
      this.$store.dispatch("project/setNewPeo", false);
      this.$store.dispatch("project/showDengJiFn", false); // 登记结果
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },

    // 补充材料的详情
    viewBuChong(row) {
      this.$store.dispatch("project/setNewPeo", false);
      this.$store.dispatch("project/showDengJiFn", false); // 不需要登记结果
      this.$store.dispatch("project/SetIsSeeProcess", false); // 是查看流程
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },

    // 审核员详情
    shenHeInfo(row) {
      this.$store.dispatch("project/setNewPeo", false);
      this.$store.dispatch("project/showDengJiFn", true); // 登记结果
      this.$store.dispatch("project/setShowDengJiInput", false); // 不能输入登记信息
      this.$store.dispatch("project/SetIsSeeProcess", false); // 是查看流程
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
      sessionStorage.setItem("clickProjectId", row.projectId);
    },

    // 显示变更弹框
    changeProjectInfo(row) {
      apiProjectInfo(row.projectId).then((res) => {
        if (res.code === 0) {
          this.projectId = Number(row.projectId);
          this.isSeeInfo = true;
          this.changeType = row.changeType + "";
          // this.changeType = 1 + "";
          let info = res.data;
          this.dialogItemObj = res.data;

          const zhuanjia = info.specialistInfo?.split(",");
          const tongxun = info.contractAddress?.split(",");
          const shouji = info.contractPhone?.split(",");
          const content = JSON.parse(info.content);

          this.dialogItemObj = {
            changeType: row.changeType,
            projectName: info.projectName, // 项目名称
            projectType: info.projectType, // 项目申报类别
            projectUnit: info.projectUnit, // 申报单位
            specialistInfo1: zhuanjia[0], // 专家信息1 - 姓名
            specialistInfo2: zhuanjia[1], // 专家信息2 - 职称
            contractAddress1: tongxun[0], // 通讯地址1 - 地址
            contractAddress2: tongxun[1], // 通讯地址2 - 邮编
            contractPhone1: shouji[0], // 1 手机号码
            contractPhone2: shouji[1], // 2 电子邮箱
            cooperateUnit: info.cooperateUnit, // 合作单位
            purpose: content.purpose, // 目的和意义
            base: content.base, // 实施基础与条件
            content: content.content, // 实施内容
            plan: content.plan, // 实施计划进度
            target: content.target, //主要技术指标及预期
            // targets: content.targets, //考核指标分解
            conditionFirst: content.conditionFirst, // 保障条件1
            conditionSecond: content.conditionSecond, //保障条件2
            // 申报书地址
            appendixUrl: JSON.parse(info.appendixUrl),
            xmProjectAppendix: {
              // 项目合同
              contractAppendixUrl: JSON.parse(
                info.xmProjectAppendix.contractAppendixUrl
              ),
              // 立项文件
              setUpAppendixUrl: JSON.parse(
                info.xmProjectAppendix.setUpAppendixUrl
              ),
              // 项目实施计划
              projectExecutionAppendixUrl: JSON.parse(
                info.xmProjectAppendix.projectExecutionAppendixUrl
              ),
              // 通知文件
              noticeAppendixUrl: JSON.parse(
                info.xmProjectAppendix.noticeAppendixUrl
              ),
              // 其他
              otherAppendixUrl: JSON.parse(
                info.xmProjectAppendix.otherAppendixUrl
              ),
              // 预算经费附件
              fundsAppendixUrl: JSON.parse(
                info.xmProjectAppendix.fundsAppendixUrl
              ),
            },
            // 实施阶段
            xmProjectPeriodList: info.xmProjectPeriodList,
          };
          // 人员
          let userArr = [];
          userArr = info.xmProjectPersonList;

          this.dialogItemObj.user = userArr.map((v) => {
            return {
              index: v.sort,
              sort: v.sort,
              age: v.personAge,
              userId: v.userId,
              dept: v.personZhiji, //职务
              unit: v.personUnit, //	单位
              work: v.personWork, // 担任工作
              name: "", //姓名
              // 注意：传的数据有所不同
              personAge: 0, //实施人员年龄
              personUnit: "", //	实施人员单位
              personWork: "", //实施人员承担的具体工作,
              personZhiji: "", //	实施人员职级
            };
          });
          if (info.xmProjectOtherPersonList.length) {
            this.dialogItemObj.otherPerson = info.xmProjectOtherPersonList;
          } else {
            this.dialogItemObj.otherPerson = [
              {
                sort: 0,
                age: "",
                dept: "", //职务
                unit: "", //	单位
                work: "", // 担任工作
                name: "", //姓名
                // 注意：传的数据有所不同
                personAge: "", //实施人员年龄
                personUnit: "", //	实施人员单位
                personWork: "", //实施人员承担的具体工作,
                personZhiji: "", //	实施人员职级
              },
            ];
          }
          console.log(this.dialogItemObj.otherPerson);
          // 经费 funds
          let fundsArr = info.xmProjectFundsList;

          let arr1 = [];
          let arr2 = [];

          for (let i = 0; i < fundsArr.length; i++) {
            if (fundsArr[i].projectPeriod == "REPORT") {
              arr1.push({
                fundsEnumName: this.yusuanlist[i], // 	支出科目
                name: this.yusuanlist[i], // 	支出科目
                amount: fundsArr[i].fundsAmount, // 金额
                note: fundsArr[i].note, // 备注
                fundsAmount: fundsArr[i].fundsAmount, //	金额
                fundsEnumKey: Number(i) + 1, //	经费所属类型KEY
              });
            } else if (fundsArr[i].projectPeriod == "SUPPLY_FILE") {
              arr2.push({
                fundsEnumName: this.yusuanlist[i - 9], // 	支出科目
                name: this.yusuanlist[i - 9], // 	支出科目
                amount: fundsArr[i].fundsAmount, // 金额
                note: fundsArr[i].note, // 备注
                fundsAmount: fundsArr[i].fundsAmount, //	金额
                fundsEnumKey: Number(i) + 1 - 9, //	经费所属类型KEY
              });
            }
          }
          this.dialogItemObj.funds = arr1;
          this.dialogItemObj.funds2 = arr2;
        }
      });
    },

    // 终审详情
    viewZhongShen(row) {
      this.$store.dispatch("project/showDengJiFn", true); // 登记结果
      this.$store.dispatch("project/setShowDengJiInput", false); // 不能输入登记信息
      this.$store.dispatch("project/SetIsSeeProcess", false); // 是查看流程
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
      sessionStorage.setItem("clickProjectId", row.projectId);
    },

    // 去补充
    toBuChong(row) {
      this.$store.dispatch("project/changeEdit", true);
      this.$store.dispatch("project/setNewPeo", true);
      this.$store.dispatch("project/showDengJiFn", true); // 登记结果
      this.$store.dispatch("project/setShowDengJiInput", true); // 能输入登记信息
      this.$store.dispatch("project/SetIsSeeProcess", false);
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },

    // 跳转到审批列表
    toShenPro(row) {
      if (row.projectId) {
        this.$store.dispatch("project/setNewPeo", false);
        this.$store.dispatch("project/showDengJiFn", false);
        this.$store.dispatch("project/SetIsSeeProcess", true);
        this.$router.push("/projectManagement/selfProject/" + row.projectId);
      }
    },

    // 终审
    toLastShen(row) {
      this.$store.dispatch("project/setNewPeo", false);
      this.$store.dispatch("project/SetIsSeeProcess", true);
      this.$store.dispatch("project/showDengJiFn", true); //显示补充材料

      this.$router.push("/projectManagement/selfProject/" + row.projectId);

      this.$store.dispatch("project/setShowDengJiInput", false); // 不能输入登记信息
    },

    // 关闭 dialog
    handleCloseFn() {
      this.isSeeInfo = false;
    },
    // 草稿-删除
    delProject(row) {
      this.$emit("delProjectFn", row.projectId);
    },

    // 编辑草稿文件
    uploadInfo(row) {
      this.$store.dispatch("project/changeEdit", true);
      this.$store.dispatch("project/setNewPeo", true); // 是否新建项目
      this.$router.push("/projectManagement/selfProject/" + row.projectId);
    },
  },
};
</script>

<style lang="scss" scoped>
.el-link {
  margin: 0 1rem;
}
.el-button {
  margin: 0 4px !important;
}
</style>
